<template>
    <div :class="`tech-goods-after-sale-list ${mode}`">
        <div class="list-container">
            <GoodsAfterSaleItem v-for="(item, index) in afterSaleList" :key="index" :itemInfo="item" />
        </div>
        <div class="bottom-action">
            <Button :disabled="false" :style="themeBackround" :round="buttonRound" size="large" @click="afterSaleAction">申请售后</Button>
        </div>
    </div>
</template>

<script>
import { Button } from 'vant';
import GoodsAfterSaleItem from './aftersale/GoodsAfterSaleItem';

import logger from '@common/logger';
import { PageMixin } from '@common/mixin';

// mock
const mock_list = [{"apply_number":"R2103081147409780000003365854806","type":2,"order_number":"M2103081122538120000003344907841","apply_time":"2021-03-08 11:47:40","warehouse_name":"体验店快餐","status":1,"status_desc":"applying","trans":4,"details":[{"prod_name":"ludan的菜","sku_name":"清蒸鱼","quantity":1,"trans":4,"pic":"o_1a4rqeir51hc51c4p1rgkesqg0q1u.png","id":"0-0","reason":"不喜欢","prod_id":225}]},{"apply_number":"R2103051505236280000003369308905","type":2,"order_number":"M2103051505005670000003353405544","apply_time":"2021-03-05 15:05:23","warehouse_name":"体验店快餐","status":5,"status_desc":"success","trans":4,"details":[{"prod_name":"ludan的菜","sku_name":"清蒸鱼","quantity":1,"trans":4,"pic":"o_1a4rqeir51hc51c4p1rgkesqg0q1u.png","id":"0-0","reason":"不喜欢","prod_id":225}]},{"apply_number":"R2103021842113710000003356339318","type":0,"order_number":"M2103021431115840000003366950010","apply_time":"2021-03-02 18:42:11","warehouse_name":"体验店快餐","status":5,"status_desc":"success","trans":4,"details":[{"prod_name":"ludan的菜","sku_name":"清蒸鱼","quantity":1,"trans":4,"pic":"o_1a4rqeir51hc51c4p1rgkesqg0q1u.png","id":"0-0","reason":"","prod_id":225}]},{"apply_number":"R2012141553219560000003339166060","type":0,"order_number":"M2012141541077620000003321036799","apply_time":"2020-12-14 15:53:21","warehouse_name":"总部仓库","status":1,"status_desc":"applying","trans":0.01,"details":[{"prod_name":"标准菜品1","sku_name":"标准菜品1","quantity":1,"trans":0.01,"pic":"image_20200820_8M8ezpR74A3A.jpeg","id":"0-0","reason":"","prod_id":6925}]},{"apply_number":"R2012011835023220000003397865135","type":1,"order_number":"M2012011834107830000003358671038","apply_time":"2020-12-01 18:35:02","warehouse_name":"体验店快餐","status":5,"status_desc":"success","trans":0.01,"details":[{"prod_name":"芒果牛奶","sku_name":"芒果牛奶","quantity":1,"trans":0.01,"pic":"","id":"0-0","reason":"多拍/错拍/不想要(未收到货)","prod_id":4776}]},{"apply_number":"R2011241113186510000003345106566","type":1,"order_number":"M2011241100376360000003316029443","apply_time":"2020-11-24 11:13:18","warehouse_name":"体验店快餐","status":1,"status_desc":"applying","trans":10.5,"details":[{"prod_name":"标准菜品2","sku_name":"标准菜品2","quantity":5,"trans":10.5,"pic":"image_20200820_8M8ezpR74A3A.jpeg","id":"0-0","reason":"快递一直未送到(未收到货)","prod_id":6926}]},{"apply_number":"R2011241101437090000003390448812","type":2,"order_number":"M2011241100376360000003316029443","apply_time":"2020-11-24 11:01:43","warehouse_name":"体验店快餐","status":5,"status_desc":"success","trans":10.5,"details":[{"prod_name":"标准菜品2","sku_name":"标准菜品2","quantity":5,"trans":10.5,"pic":"image_20200820_8M8ezpR74A3A.jpeg","id":"0-0","reason":"质量问题","prod_id":6926}]},{"apply_number":"R2011241056468320000003306352410","type":2,"order_number":"M2011241045021690000003396191304","apply_time":"2020-11-24 10:56:46","warehouse_name":"体验店快餐","status":5,"status_desc":"success","trans":0.03,"details":[{"prod_name":"标准菜品1","sku_name":"标准菜品1","quantity":3,"trans":0.03,"pic":"image_20200820_8M8ezpR74A3A.jpeg","id":"0-0","reason":"不喜欢","prod_id":6925}]},{"apply_number":"R2011241052403600000003342465396","type":2,"order_number":"M2011241045021690000003396191304","apply_time":"2020-11-24 10:52:40","warehouse_name":"体验店快餐","status":5,"status_desc":"success","trans":0.02,"details":[{"prod_name":"标准菜品1","sku_name":"标准菜品1","quantity":2,"trans":0.02,"pic":"image_20200820_8M8ezpR74A3A.jpeg","id":"0-0","reason":"不喜欢","prod_id":6925}]},{"apply_number":"R2011241047441490000003318763226","type":2,"order_number":"M2011241045021690000003396191304","apply_time":"2020-11-24 10:47:44","warehouse_name":"体验店快餐","status":7,"status_desc":"closed","trans":0.05,"details":[{"prod_name":"标准菜品1","sku_name":"标准菜品1","quantity":5,"trans":0.05,"pic":"image_20200820_8M8ezpR74A3A.jpeg","id":"0-0","reason":"不喜欢","prod_id":6925}]}];

export default {
    name: 'GoodsAfterSaleList', // 商品售后列表
    mixins: [PageMixin],
    components: {
        Button,
        GoodsAfterSaleItem,
    },
    data() {
        return {
            afterSaleList: [...mock_list],
        };
    },
    methods: {
        afterSaleAction() {
            logger.info('GoodsAfterSaleList => 申请售后');
        },
    },
};
</script>

<style lang="less">
.tech-goods-after-sale-list {
    .flex-column();
    height: 100vh;
    .mode-white();
    &.white {
        background-color: @shop-bg-color;
    }
    .list-container {
        .p(@gap-md);
        flex: 1;
        overflow-y: scroll;
    }
    .bottom-action {
        .p(@gap-md);
        padding-bottom: @gap-md;
        padding-bottom: calc(@gap-md + constant(safe-area-inset-bottom));;
        padding-bottom: calc(@gap-md + env(safe-area-inset-bottom));;
    }
}
</style>
